<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head th:replace="admin/_fragments :: head(~{::title})">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>登录</title>
  <link rel="stylesheet" href="../../static/css/me.css"/>
  <!-- 引入semantic css-->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
  <link rel="stylesheet" href="../../static/lib/editormd/css/editormd.min.css">
</head>
<body>
  <div class="m-container-small m-padding-tb-massive" style="max-width: 30em!important;">
    <div class="ui container" style="margin-top: 13em!important;">
      <div class="ui middle aligned center aligned grid">
        <div class="column">
          <h2 class="ui teal image header">
<!--            <img src="assets/images/logo.png" class="image">-->
            <div class="content">
              小克的猫爬架后台管理登录
            </div>
          </h2>
          <form class="ui large form" method="post" action="#" th:action="@{/admin/login}">
            <div class="ui stacked segment">
              <div class="field">
                <div class="ui left icon input">
                  <i class="user icon"></i>
                  <input type="text" name="username"  placeholder="用户名" spellcheck="false" data-ms-editor="true">
                </div>
              </div>
              <div class="field">
                <div class="ui left icon input">
                  <i class="lock icon"></i>
                  <input type="password" name="password" placeholder="密码">
                </div>
              </div>
              <button class="ui fluid large teal submit button">登   录</button>
            </div>

              <div class="ui error message" style="color: red"></div>
              <div class="ui mini negative message" th:unless="${#strings.isEmpty(message)}" th:text="${message}" style="color: red"></div>

          </form>
        </div>
      </div>
    </div>
  </div>

  <!-- 引入semantic js-->
  <script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
    <script>
        $('.ui.form').form({
            fields: {
                username : {
                    identifier: 'username',
                    rules: [{
                        type: 'empty',
                        prompt: '请输入用户名！'
                    }]
                },
                password : {
                    identifier: 'password',
                    rules: [{
                        type: 'empty',
                        prompt: '请输入密码！'
                    }]
                }
            }
        })
    </script>
</body>
</html>